<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<script src="../js/jquery.js"></script>
<script>
	$(document).ready(function(){
		$("#append_text").click(function(){
			$("p").append(" <b>Appended text</b>");
		});
		$("#append_item").click(function(){
			$("ol").append("<li>Appended item</li>");
		});
		$("#prepend_text").click(function(){
			$("p").prepend("<b>Prepend text</b> ");
		});
		$("#prepend_item").click(function(){
			$("ol").prepend("<li>Prepend item</li>");
		});
	});
</script>
<title>DOM Add</title>
</head>
<body>
<p>This is a paragraph.</p>
<p>This is another paragraph.</p>
<ol>
<li>List item 1</li>
<li>List item 2</li>
<li>List item 3</li>
</ol>
<button id="append_text">Append text</button>
<button id="append_item">Append item</button>
<button id="prepend_text">Prepend text</button>
<button id="prepend_item">Prepend item</button>
</body>
</html>